<template>
	<view class="wrap-box">
		<view class="user-box">
			<block
				v-if="template.length"
				v-for="(item, index) in template"
				:key="index"
			>
				<!-- 搜索 -->
				<sh-search
					v-if="item.type === 'search'"
					:detail="item"
					:bgcolor="bgcolor"
				></sh-search>
				<!-- 轮播 -->
				<sh-banner
					v-if="item.type === 'banner'"
					:detail="item.content"
					@getbgcolor="getbgcolor"
				></sh-banner>
				<!-- 菜单 -->
				<sh-menu
					v-if="item.type === 'menu'"
					:detail="item.content"
					:menu="item.content.style"
					:imgW="94"
				></sh-menu>
				<!-- 推荐商品 -->
				<sh-hot-goods
					v-if="
						item.type === 'goods-list' ||
							item.type === 'goods-group'
					"
					:detail="item.content"
				></sh-hot-goods>
				<!-- 广告魔方 -->
				<sh-adv
					v-if="item.type === 'adv'"
					:detail="item.content"
				></sh-adv>
				<!-- 优惠券 -->
				<sh-coupon
					v-if="item.type === 'coupons'"
					:detail="item.content"
				></sh-coupon>
				<!-- 秒杀 -->
				<sh-seckill
					v-if="item.type === 'seckill'"
					:detail="item.content"
				></sh-seckill>
				<!-- 拼团 -->
				<sh-groupon
					v-if="item.type === 'groupon'"
					:detail="item.content"
				></sh-groupon>
				<!-- 个人信息 -->
				<sh-userinfo
					v-if="item.type === 'user'"
					:detail="item.content"
				></sh-userinfo>
				<!-- 订单卡片 -->
				<sh-order
					v-if="item.type === 'order-card'"
					:detail="item.content"
				></sh-order>
				<!-- 功能列表 -->
				<sh-nav
					v-if="item.type === 'nav-list'"
					:detail="item.content"
				></sh-nav>
				<!-- 钱包 -->
				<sh-wallet
					v-if="item.type === 'wallet-card'"
					:detail="item.content"
				></sh-wallet>
				<!-- 商户入驻 -->
				<sh-wallet33
					v-if="item.type === 'wallet-card' && show"
					:detail="item.content"
				></sh-wallet33>
				<!-- 奖金池 -->
				<sh-wallet11
					v-if="item.type === 'wallet-card' && show"
					:money="money"
				></sh-wallet11>
				<!--排行榜  -->
			<!-- 	<sh-wallet22
					v-if="item.type === 'wallet-card'"
					:detail="item.content"
				></sh-wallet22> -->
				<!-- 九宫格列表 -->
				<sh-grid
					v-if="item.type === 'grid-list'"
					:detail="item.content"
				></sh-grid>
				<!-- 富文本 -->
				<sh-richtext
					v-if="item.type === 'rich-text'"
					:detail="item.content"
				></sh-richtext>
				<!-- 功能标题 -->
				<sh-title-card
					v-if="item.type === 'title-block'"
					:detail="item.content"
				></sh-title-card>
				<!-- 直播 -->
				<!-- #ifdef MP-WEIXIN -->
				<sh-live
					v-if="item.type === 'live' && HAS_LIVE"
					:detail="item.content"
				></sh-live>
				<!-- #endif -->
			</block>

			<!-- <view
				class=""
				@tap="jump('/pages/public/feedback')"
				style="width: 100vw;height: 100rpx; 
				line-height: 100rpx;
				 text-align: center;  
				 color: #999999; 
				 font-size: 35rpx; 
				 font-weight: 500;
				 " 
				 
			>
				投诉和建议
			</view> -->

			

			<!-- 关注弹窗 -->
			<shopro-float-btn></shopro-float-btn>
			<!-- 连续弹窗提醒 -->
			<shopro-notice-modal></shopro-notice-modal>
			<!-- 登录提示 -->
			<shopro-login-modal></shopro-login-modal>
		</view>
		<!-- 自定义底部导航 -->
		<shopro-tabbar></shopro-tabbar>
	</view>
</template>

<script>
import Wechat from '@/common/wechat/wechat';

import shSearch from './components/sh-search.vue';
import shBanner from './components/sh-banner.vue';
import shHotGoods from './components/sh-hot-goods.vue';
import shMenu from './components/sh-menu.vue';
import shAdv from './components/sh-adv.vue';
import shCoupon from './components/sh-coupon.vue';
import shSeckill from './components/sh-seckill.vue';
import shGroupon from './components/sh-groupon.vue';
import shRichtext from './components/sh-richtext.vue';
import shNav from './components/sh-nav.vue';
import shUserinfo from './components/sh-userinfo.vue';
import shOrder from './components/sh-order.vue';
import shWallet from './components/sh-wallet.vue';
import shWallet11 from './components/sh-wallet11.vue';
import shWallet22 from './components/sh-wallet22.vue';
import shWallet33 from './components/sh-wallet33.vue';
import shGrid from './components/sh-grid.vue';
import shTitleCard from './components/sh-title-card.vue';

import shoproNoticeModal from '@/components/shopro-notice-modal/shopro-notice-modal.vue';
import { mapMutations, mapActions, mapState } from 'vuex';
export default {
	components: {
		shSearch,
		shBanner,
		shHotGoods,
		shMenu,
		shAdv,
		shCoupon,
		shSeckill,
		shGroupon,
		shRichtext,
		shNav,
		shUserinfo,
		shOrder,
		shWallet11,
		shWallet22,
		shWallet33,
		shWallet,
		shGrid,
		shTitleCard,
		shoproNoticeModal
	},
	data() {
		return {
			platform: uni.getStorageSync('platform'), //当前平台。
			isRefresh: false, //更新
			scrollTop: 0, //页面滚动距离
			bgcolor: '',
			money: {},
			show: false
		};
	},
	computed: {
		...mapState({
			initData: state => state.init.initData, //初始化数据
			template: state => state.init.templateData.user, //模板数据
			userInfo: state => state.user.userInfo,
			orderNum: state => state.user.orderNum,
			cartNum: state => state.cart.cartNum,
			forceOauth: state => state.user.forceOauth
		}),
		info() {
			if (this.initData) {
				return this.initData.info;
			}
		},
		popupUser() {
			if (this.initData.popup) {
				return this.initData.popup.content.user;
			}
		}
	},
	onPullDownRefresh() {
		this.init();
	},
	onLoad() {
		this.getUsers();
	},
	onShow() {
		this.$store.commit('CART_NUM');
		this.init();
		this.$forceUpdate();
	},
	methods: {
		...mapActions(['getUserInfo', 'getOrderNum']),
		// 初始化
		init() {
			return Promise.all([this.getUserInfo(), this.getOrderNum()])
				.then(() => {
					uni.stopPullDownRefresh();
				})
				.catch(() => {
					uni.stopPullDownRefresh();
				});
		},

		jump(path, query) {
			this.$Router.push({
				path: path,
				query: query
			});
		},
		getbgcolor(e) {
			this.bgcolor = e;
		},
		//
		// 获取用户的id
		async getUsers() {
			const res = await this.$api('user.info');
			var uid = res.data.id;
			this.getIndv(uid);
			this.getTheTeam(uid);
			this.getActivity(uid);
		},
		//获取个人奖金池
		async getIndv(uid) {
			console.log('uid :>> ', uid);
			const res = await this.$api('indvBonusPool', {
				uid: uid
			});
			console.log('获取个人奖金池 :>> ', res);

			this.money.money0 = res.money;
		},
		//获取团队奖金池
		async getTheTeam(uid) {
			console.log('uid :>> ', uid);
			const res = await this.$api('teamBonusPool', {
				uid: uid
			});
			console.log('获取团队奖金池 :>> ', res);
			this.money.money1 = res.money;
		},
		//获取活动奖金池
		async getActivity(uid) {
			console.log('uid :>> ', uid);
			const res = await this.$api('activityBonusPool');
			console.log('获取活动奖金池 :>> ', res);
			this.money.money2 = res.money;
			console.log('活动金额:>> ', this.money);
			//this.show = true
			var that = this;
			setTimeout(function() {
				that.show = true;
			}, 50);
		}
	}
};
</script>

<style lang="scss">
.user-box {
	overflow-x: hidden;
	position: relative;
	overflow-y: auto;
	// height: 100%;
}

// 微信登录蒙层
.login-box {
	position: fixed;
	z-index: 9999;
	width: 100%;
	height: 100%;
	background: none;
}

// 顶部
.transtion-head {
	height: 120rpx;
	background: #fff;
	width: 100%;
	position: fixed;
	top: 0;
	z-index: 99;
	transition: all 0.2s linear;
	transform: translateY(-120rpx);
	border-bottom: 1rpx solid #f2f2f2;
}

.transtion-head--active {
	height: 120rpx;
	background: #fff;
	width: 100%;
	position: fixed;
	top: 0;
	z-index: 99;
	transition: all 0.2s linear;
	transform: translateY(0rpx);
	border-bottom: 1rpx solid #f2f2f2;
}

.foot_box {
	padding-top: 200rpx;
	padding-bottom: calc(var(--window-bottom) + 30px);
	margin-bottom: 50rpx;
}

.copyright {
	color: #999;

	.code1 {
		font-size: 24rpx;
	}

	.code2 {
		font-size: 20rpx;
		margin-top: 10rpx;
	}
}
</style>
